import QtQuick 2.0
import QtQuick.Layouts 1.1
import QtQuick.Window 2.0
import QtQuick.Controls 1.4
Item{
        property int centerX: 0
        property int centerY: 0
        property string fileName
        property alias kb:knob
        property double value: 0   // 0 - 360
        property bool repeat: false
        width: 120
        height: 120
        Layout.alignment: Qt.AlignCenter
    Rectangle{
        id:knob
        anchors.fill: parent
//        Layout.alignment: Qt.AlignCenter
//        width: 120
//        height: 120
        color: "transparent"
        Image {
            id: img
            width: parent.width
            height: parent.height
            source: fileName
            anchors.fill: parent
            fillMode: Image.Stretch

            transformOrigin: Item.Center
        }
        MouseArea {
            id:mouse
            property double pressdAngle: 0.0

            property double pressX: 0.0
            property double pressY: 0.0

            anchors.fill: parent
            onPressed: {
                console.log(mouseX, mouseY)
                pressX = mouseX - centerX
                pressY = mouseY - centerY

                pressdAngle = Math.atan2(pressY, pressX) * 180 / Math.PI -  img.rotation;
            }

            onPositionChanged: {
                var angleDeg = Math.atan2(mouseY - centerY, mouseX - centerX) * 180 / Math.PI;
                img.rotation = angleDeg - pressdAngle
                console.log(mouseX, mouseY)
            }

        }
    }
//Rectangle{
//    property int centerX: 0
//    property int centerY: 0
//    property string fileName
//    property alias kb:
//    property double value: 0   // 0 - 360
//    property bool repeat: false
//    Layout.alignment: Qt.AlignCenter
//    width: 120
//    height: 120
//    color: "transparent"
//    Image {
//        id: img
//        width: parent.width
//        height: parent.height
//        source: fileName
//        anchors.fill: parent
//        fillMode: Image.Stretch

//        transformOrigin: Item.Center
//    }
//    MouseArea {
//        property double pressdAngle: 0.0

//        property double pressX: 0.0
//        property double pressY: 0.0

//        anchors.fill: parent
//        onPressed: {
//            console.log(mouseX, mouseY)
//            pressX = mouseX - centerX
//            pressY = mouseY - centerY

//            pressdAngle = Math.atan2(pressY, pressX) * 180 / Math.PI -  img.rotation;
//        }

//        onPositionChanged: {
//            var angleDeg = Math.atan2(mouseY - centerY, mouseX - centerX) * 180 / Math.PI;
//            img.rotation = angleDeg - pressdAngle
//            console.log(mouseX, mouseY)
//        }

//    }
//}
}
